import React from 'react'
import { connect } from 'react-redux'
function Count(props) {
  return (
    <div>
      <p>{props.count}</p>
      <button
        onClick={() => {
          props.dispatch({ type: 'add' })
        }}
      >
        +
      </button>
      <button onClick={() => {}}>点击等待1s中再加</button>
    </div>
  )
}
// WithCount就是监听redux数据变化的父组件
// 1. connect第一次调用什么都不写,则Count组件通过props只能拿到一个dispatch方法,无法获取到redux数据
// 2. 如果Count组件需要获取redux中的数据,则需要在connect第一次调用的时候,传入一个函数.这个函数如下
function mapStateToProps(state) {
  // state是redux中所有数据，这个其实就是把Count需要的数据过滤出来，传递到Count的props上面
  console.log(state)
  return {
    count: state.count,
  }
}
const WithCount = connect(mapStateToProps)(Count)
export default WithCount

/*
 以前写高阶组件： 
 function xxx(){
   return class extends Component{}
 }

 function connect(){
  return ()=>{
    return Class extends Component{}

  } 
}

*/
